<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org"  
      xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity3">  
    <head>  
        <title>角色管理</title>  
        <script src="/scripts/boot.js"></script>
        <style>
        	html,body{
			   margin:0;padding: 0;border:0;width:100%;height:100%;overflow:hidden;
			}
			body{
				padding:20px;
			}
        </style>
    </head>  
    <body>
	<div class="title-list mb-20"><span class="title-listbg"></span><span>角色列表</span></div>
		<div id="queryForm"  class="mini-toolbar1" style="border-bottom:0;padding:0px;">
			<table style="width:100%;">
				<tr>
					<td style="width:100%;">
						<div class="mb-20 position-rel">
							<span class="search-title search-ml20">名称</span><input id = "name" name="name" class="mini-textbox search-200px" value="">
							<a class="add-botton search-ml60" onclick="list.search()">查询</a>
							<a class="resetting-btn search-ml20" onclick="list.reset()">重置</a>
						</div>
					</td>
				</tr>
			</table>
		</div>
		<div class="container">
			<div class="mini-clearfix mb-10">
				<div class="mini-col-6 mini-col-sm-3">
					<a class="plan-btn mR-20"  onclick="list.addOrEdit('new')"><span class="add-bg"></span>新增</a>
				</div>
			</div>
		</div>
   		<div class="mini-fit">
			<div id="datagrid1" class="mini-datagrid" style="width:100%;height:100%;"  url="/myRole/listByPage" sizeList="[5,10,20,50]" pageSize="20"  idField="id">
			    <div property="columns">
			        <div type="indexcolumn" width="30" headerAlign="center" align="center">编号</div>
			        <div field="roleName"   width="300" headerAlign="center" align="center" allowSort="false">名称</div>
			        <div field="name"  width="300"  headerAlign="center" align="center" allowSort="false">标识</div>
			        <div field="code"  width="300"  headerAlign="center" align="center" allowSort="false">编码</div>
			        <div name="action" width="200"  headerAlign="center" align="center" allowSort="false">操作</div>
			    </div>
			</div>   
		</div>
		<script type="text/javascript">
            var grid;
            var list = {
                //页面初始化
                init: function() {
                    mini.parse();
                    grid = mini.get("datagrid1");
                    grid.load();
                    grid.on("drawcell", function (e) {
                        var column = e.column;
                        var record = e.record;
                        if (column.name == "action") {
                            e.cellHtml = '<a class="revise-botton" href="javascript:list.addOrEdit(\''+'edit'+'\')">编辑</a><a class="del-botton btn-bd" onclick="list.remove()">删除</a>';
                        }
                    });
                },
                //    新增或编辑
                addOrEdit: function (opt) {
                    mini.open({
                        url: "/rbac/role/add.html",
                        title: (opt=="edit"?"编辑":"新增")+"角色",
                        width: 1000,
                        height: 360,
                        onload: function () {
                            if(opt=="edit"){
                                var row = grid.getSelected();
                                var data = {"id": row.id,"name":row.name,"state":opt};
                            }else{
                                var data = {"state":opt};
                            }
                            var iframe = this.getIFrameEl();
                            iframe.contentWindow.view.SetData(data);
                        },
                        ondestroy: function (action) {
                            grid.reload();
                        }
                    });
                },
               
                // 查询
                search: function () {
                    var data = {
                        "name": mini.get("name").getValue(),
                    };
                    grid.load(data);
                },
                //重置
                reset:function(){
                    var form = new mini.Form("queryForm");
                    form.reset();
                    grid.load()
                },
                //    删除
                remove: function () {
                    var row = grid.getSelected();
                    if (row) {
                        mini.confirm("确定删除选中记录？","确定",function (action) {
                            if(action=="ok"){
                                $.ajax({
                                    url: "/myRole/del?id="+row.id,
                                    success:function(text) { 
                                    	if(text.state){
                                            grid.reload();
                                    	}else{
                                    		mini.alert(text.message);
                                    	}
                                    },
                                    error:function (errorMsg) {
                                        common.prompt(errorMsg.message);
                                    }
                                });
                            }
                        });
                    } else {
                        alert("请选中一条记录");
                    }
                }
            };
            list.init();
		</script> 
	</body>  
</html>  